<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Products</title>
<!-- Custom Theme files -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- //Custom Theme files -->
<link href="/front/css/bootstrap.css" type="text/css" rel="stylesheet" media="all">
<link href="/front/css/style.css" type="text/css" rel="stylesheet" media="all">
<link href="/front/css/form.css" rel="stylesheet" type="text/css" media="all" />
<!-- js -->
<script src="/front/js/jquery.min.js"></script>
<script type="text/javascript" src="/front/js/bootstrap-3.1.1.min.js"></script>
<!-- //js -->	
<!-- cart -->
<script src="/front/js/simpleCart.min.js"> </script>
<!-- cart -->
<!-- the jScrollPane script -->
<script type="text/javascript" src="/front/js/jquery.jscrollpane.min.js"></script>
		<script type="text/javascript" id="sourcecode">
			$(function()
			{
				$('.scroll-pane').jScrollPane();
			});
		</script>
<!-- //the jScrollPane script -->
<script type="text/javascript" src="/front/js/jquery.mousewheel.js"></script>
<!-- the mousewheel plugin -->		
</head>
<body>
<!--header-->
	<div class="header">
		<div class="container">
			<nav class="navbar navbar-default" role="navigation">
				<div class="navbar-header">
					<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
						<span class="sr-only">Toggle navigation</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
					<h1 class="navbar-brand"><a  href="index">Yummy</a></h1>
				</div>
				<!--导航栏navbar-header-->
				<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
					<ul class="nav navbar-nav">
						<li><a href="index" >首页</a></li>
                        
						<li >
							<a href="all" class="active">生日蛋糕</a>
							
					   <li class="dropdown grid">
							<a href="#">精品糕点</a>
										
					  <li class="dropdown grid">
							<a href="#" class="dropdown-toggle list1" data-toggle="dropdown">联系我们 </a>
														
				  </ul> 
					<!--/.navbar-collapse-->
				</div>
				<!--//navbar-header-->
			</nav>
			<div class="header-info">
              <!--导航栏查找小标志-->
				<div class="header-right search-box">
					<a href="#"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></a>				
					<div class="search">
						<form class="navbar-form">
							<input type="text" class="form-control">
							<button type="submit" class="btn btn-default" aria-label="Left Align">
								Search
							</button>
						</form>
					</div>	
				</div>
                <!--导航栏登录小标志-->
				<div class="header-right login">
					<a href="#"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></a>
					<div id="loginBox">                
						<form id="loginForm">
							<fieldset id="body">
								<fieldset>
									<label for="email">Email Address</label>
									<input type="text" name="email" id="email">
								</fieldset>
								<fieldset>
									<label for="password">Password</label>
									<input type="password" name="password" id="password">
								</fieldset>
								<input type="submit" id="login" value="Sign in">
								<label for="checkbox"><input type="checkbox" id="checkbox"> <i>Remember me</i></label>
							</fieldset>
							<p>New User ? <a class="sign" href="account">Sign Up</a> <span><a href="#">Forgot your password?</a></span></p>
						</form>
					</div>
				</div>
                <!--导航栏购物车小标志-->
				<div class="header-right cart">
					<a href="#"><span class="glyphicon glyphicon-shopping-cart" aria-hidden="true"></span></a>
					<div class="cart-box">
						<h4><a href="checkout">
							<span class="simpleCart_total"> $0.00 </span> (<span id="simpleCart_quantity" class="simpleCart_quantity"> 0 </span>) 
						</a></h4>
						<p><a href="javascript:;" class="simpleCart_empty">Empty cart</a></p>
						<div class="clearfix"> </div>
					</div>
				</div>
				<div class="clearfix"> </div>
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>
	<!--//header-->
	
     
	<!--products-->
	<div class="products">	 
		<div class="container">
			<h2>Our Products</h2>	
            	<div class="product-model-sec single-product-grids">
				<div th:each="product : ${products}"  class="product-grid single-product"  style="height:380px">
					<!-- herf 图片链接 -->
					<a href="@{/single}">					
					<div style="height:200px" class="product-img b-link-stripe b-animate-go  thickbox">
						<img th:src="${product.getImgs().get(0).getImgUrl()}" alt="">
						<div class="b-wrapper">
						<h4 class="b-animate b-from-left  b-delay03">							
						<button>View</button>
						</h4>
						</div>
					</div>
					</a>					
					<div class="product-info simpleCart_shelfItem">
						<div class="product-info-cust prt_name"  >
							<h4 th:text="${product.productName}"></h4>							
							<span class="item_price" th:text="'$'+${product.productPrice}"></span>
							<div class="ofr">
							  <p class="pric1"><del>$2300</del></p>
							  <p class="disc">[15% Off]</p>
							</div>
							<!-- Add 的 链接 -->
							<form th:action="@{single/${product.productId}}" method="get">
                            <input type="submit" class="item_add items" value="Add">
                            </form>
							<div class="clearfix"> </div>
						</div>												
					</div>
				</div>
				<div class="clearfix"> </div>
			</div>
            
            </div></div><!--//products-->
	<div class="footer-bottom">
		<div class="container">
			<p> 2019 yummy cakes for u.
	</div>
</body>
</html>